import React from "react";
import { RouteComponentProps } from "react-router";
import MovieForm from "../../components/MovieForm";
import { MovieService, IMovie } from "../../services/MovieService";

// type EditMovieProps = {
//     history:x
// }

interface IParams{
    id:string
}

interface EditPageState{
    movie?:IMovie
}
// interface Myprops extends RouteComponentProps<IParams>{
//     abc:string
// }

interface Myprops{
    id:string
}
// 交叉类型
type AllProps = Myprops & RouteComponentProps<IParams>;

// 针对于ts而言，组件中的属性没有类型检查 引入RouteComponentProps泛型作为类型声明
export default class extends React.Component<AllProps,EditPageState> {

    state:EditPageState = {
        movie:undefined
    }

    async componentDidMount(){
        const resp = await MovieService.getMovieById(this.props.match.params.id);
        if(resp.data){
            this.setState({
                movie:resp.data
            })
        }
    }

    render(){
        // console.log(this.props.match.params.id);
        // this.setState({
        //     movie
        // })
        return (
            <MovieForm 
                movie={this.state.movie}
                onSubmit={async movie=>{
                const resp = await MovieService.edit(this.props.match.params.id,movie);
                if(resp.data){
                    return "";
                }else{
                    return resp.err;
                }
            }}></MovieForm>
        )
    }
}